<template>
  <div class="app-container">
    <el-form :inline="true" :model="queryParams" class="demo-form-inline">
      <el-form-item label="ID">
        <el-input v-model="queryParams.id" placeholder="id" />
      </el-form-item>
      <el-form-item label="昵称">
        <el-input v-model="queryParams.nickName" placeholder="昵称" />
      </el-form-item>
      <!-- <el-form-item label="状态">
        <el-select v-model="queryParams.isEnable" placeholder="请选择">
          <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item> -->
      <el-form-item label="排序">
        <el-select v-model="queryParams.orderBy" placeholder="请选择">
          <el-option v-for="item in sortByList" :key="item.id" :label="item.text" :value="item.id" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">查询</el-button>
        <el-button type="primary" @click="reset">重置</el-button>
      </el-form-item>
    </el-form>

    <el-table v-loading="listLoading" :data="list" element-loading-text="Loading" border fit highlight-current-row>
      <el-table-column align="center" label="id" prop="id" width="95" />
      <el-table-column label="昵称" align="center" prop="username" />
      <!-- <el-table-column label="用户名" align="center" prop="username" /> -->
      <el-table-column label="邮箱" align="center" prop="email" />
      <el-table-column label="备注" align="center" prop="remarks" />

      <el-table-column label="团队等级" align="center">
        <template slot-scope="scope">
          {{ Number(scope.row.teamRate * 100).toFixed(2) }}%
        </template>
      </el-table-column>
      <el-table-column label="上级id" align="center" prop="inviteCode" />
      <el-table-column label="用户余额" align="center" prop="trxBalance" />
      <!-- <el-table-column label="保险仓余额" align="center" prop="insuranceBalance" /> -->
      <el-table-column label="wk余额" align="center">
        <template slot-scope="scope">
          {{ scope.row.fuel }}
          <el-tag @click="fuelSetting(scope.row)">设置</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="是否合伙人" align="center" width="140">
        <template slot-scope="scope">
          {{ scope.row.isPartner ? `是(${scope.row.partnerLevel}级合伙人)` : '否' }}
        </template>
      </el-table-column>
      <el-table-column label="是否身份认证" align="center" width="140">
        <template slot-scope="scope">
          <el-switch @change="handleStatus(scope.row)" v-model="scope.row.isAuth" :active-value="1" :inactive-value="0">
          </el-switch>
        </template>
      </el-table-column>
      <!-- <el-table-column label="待释放保险仓余额" align="center" prop="freezeInsuranceBalance" /> -->
      <el-table-column label="ai托管中总额" align="center" prop="aiAmount" />
      <!-- <el-table-column label="今日盈亏" align="center" prop="todayWin" /> -->
      <el-table-column label="创建时间" align="center" prop="createTime" />
      <el-table-column label="操作" align="center" width="250">
        <template slot-scope="scope">
          <el-button type="text" @click="handleShowInfo(scope.row)">查看</el-button>
          <el-button type="text" @click="handleHistory(scope.row)">{{
            scope.row.isEnable == 1 ? "封禁" : "解封"
          }}</el-button>
          <el-dropdown style="margin-left: 15px" trigger="click">
            <span class="el-dropdown-link">
              <el-button type="text">更多</el-button><i class="el-icon-arrow-down el-icon--right" />
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item>
                <el-button type="text" @click="handleC(scope.row)">增加燃料</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleEdit(scope.row)">修改上级</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleAdd(scope.row)">设置团队等级</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleTd(scope.row, 0)">查询团队</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleBill(scope.row)">查询账单</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handlePartent(scope.row)">设置合伙人</el-button>
              </el-dropdown-item>
              <el-dropdown-item v-if="scope.row.isPartner">
                <el-button type="text" @click="handleLevel(scope.row)">设置合伙人等级</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleRemark(scope.row)">设置备注</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleResetPassWord(scope.row)">重置密码</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleEmail(scope.row)">修改邮箱</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleBalance(scope.row)">扣减余额</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button type="text" @click="handleReansform(scope.row)">{{scope.row.canWithdraw==1?'禁用':'启用'}}提现/转账 </el-button>
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination">
      <el-pagination :current-page.sync="queryParams.pageNum" :page-sizes="[10, 20, 30, 40]"
        :page-size.sync="queryParams.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"
        @size-change="fetchData" @current-change="fetchData" />
    </div>
    <showInfo ref="showInfo" />
    <add ref="add" />
    <addC ref="addC" />
    <children ref="children" />
    <userComponents ref="userComponents" />
    <tds ref="td" />
    <product ref="product" />
    <remark ref="remark" />
    <fuelSetting ref="fuelSetting" />
    <partent ref="partent" />
    <level ref="level" />
    <email ref="email" /> 
    <balance ref="balance" />
  </div>
</template>

<script>
import showInfo from './showInfo.vue'
import add from './add.vue'
import addC from './addC.vue'
import children from './children.vue'
import userComponents from './user.vue'
import tds from './td.vue'
import product from './product.vue'
import remark from './remark.vue'
import fuelSetting from './fuelSetting.vue'
import partent from './partent.vue'
import level from './level.vue'
import email from './email.vue'
import balance from './balance.vue'
import { userList, userUserEnable, resetPassword, setAuth,setWithdraw } from '@/api/table'
export default {
  components: {
    showInfo,
    add,
    addC,
    children,
    userComponents,
    tds,
    product,
    remark,
    fuelSetting,
    partent,
    level,
    email,
    balance
  },
  data() {
    return {
      list: null,
      listLoading: true,
      total: 0,
      timer: null,
      statusOptions: [
        { label: '正常', value: '1' },
        { label: '禁用', value: '0' }
      ],
      sortByList: [
        { id: 'trx_balance', text: '余额' },
        { id: 'insurance_balance', text: '保险仓余额' },
        { id: 'fuel', text: 'wk余额' },
        { id: 'fix_insurance_balance', text: 'ai托管金额' }
      ],
      queryParams: {
        nickName: '',
        mobile: '',
        isEnable: '',
        pageSize: 10,
        pageNum: 1,
        userNo: '',
        id: '',
        orderBy: '',
        orderDirection: 'DESC'
      }
    }
  },
  created() {
    this.fetchData()
  },
  destroyed() { },
  methods: {
    async handleStatus(e) {
      await setAuth({ userId: e.id, auth: e.isAuth })
      this.fetchData()
    },
    fuelSetting(record) {
      this.$refs.fuelSetting.show(record)
    },
    handleResetPassWord(record) {
      console.log(record)
      this.$confirm('是否确认?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        resetPassword({ userId: record.id, type: 0 }).then(res => {
          this.$message({
            message: '操作成功',
            type: 'success'
          })
          this.fetchData()
        })
      })
    },
    handleReansform(record) {
      console.log(record)
      this.$confirm(
        '此操作将' + (record.canWithdraw==1 ? '禁用' : '启用') + '转账, 是否继续?',
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      ).then(async () => {
        await setWithdraw(record.id,record.canWithdraw==1 ? 0 : 1)
        this.$message({
          message: '操作成功',
          type: 'success'
        })
        this.fetchData()
      })
    },
    handleBalance(record){
      this.$refs.balance.show(record)
    },
    async setStatus(user) {
      let status = ''
      if (user.status === 1) {
        status = 0
      } else {
        status = 1
      }
      await userUserEnable({ id: user.id, status: status })
      this.fetchData()
      this.$message({
        message: '操作成功',
        type: 'success'
      })
    },
    handleRemark(record) {
      this.$refs.remark.show(record)
    },
    handleTd(record, index) {
      console.log('....................')
      this.$refs.td.show(record, index)
    },
    // 修改邮箱'
    handleEmail(record) {
      this.$refs.email.show(record)
    },
    handleBill(record) {
      this.$refs.children.show(record)
    },
    handlePartent(record) {
      this.$refs.partent.show(record)
    },
    handleLevel(record) {
      this.$refs.level.show(record)
    },
    handleHistory(record) {
      this.$confirm(
        '此操作将' + (record.isEnable === 1 ? '禁用' : '启用') + ', 是否继续?',
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      ).then(async () => {
        await userUserEnable({
          id: record.id,
          enable: record.isEnable === 1 ? 0 : 1
        })
        this.fetchData()
      })
    },
    handleC(record) {
      this.$refs.addC.show(record)
    },
    // handleChildren(record) {
    //   this.$refs.children.show(record)
    // },
    handleUser(record) {
      this.$refs.userComponents.show(record)
    },

    fetchData() {
      this.listLoading = true
      userList(this.queryParams).then((response) => {
        response.data.records.map((item) => {
          if (item.status === 1) {
            item.statusB = true
          } else {
            item.statusB = false
          }
          console.log(item.statusB)
        })
        this.list = response.data.records
        this.listLoading = false
        this.total = response.data.total
      })
    },
    handleShowInfo(e) {
      this.$refs.showInfo.show(e)
    },
    onSubmit() {
      this.queryParams.pageNum = 1
      this.fetchData()
    },
    reset() {
      this.queryParams = {
        nickName: '',
        mobile: '',
        status: '',
        pageSize: 10,
        pageNum: 1,
        userNo: '',
        id: '',
        orderBy: '',
        orderDirection: 'DESC'
      }
      this.fetchData()
    },
    handleAdd(record) {
      this.$refs.add.show(record)
    },
    handleEdit(e) {
      this.$refs.product.show(e)
    }
  }
}
</script>
